<template>
  <div class="page-cont">
    <van-nav-bar
      title="新增周计划"
      left-arrow
      @click-left="$router.go(-1)"
    />
    <div class="list">
      <week-select v-model="form.yearMonthWeek" />

      <div class="b" />

      <van-field
        label="梁片总数"
        placeholder="请输入"
        type="number"
        input-align="right"
        v-model="form.sliceNum"
      />
      <van-field
        label="中梁总数"
        placeholder="请输入"
        type="number"
        input-align="right"
        v-model="form.middleNum"
      />
      <van-field
        label="边梁总数"
        placeholder="请输入"
        type="number"
        input-align="right"
        v-model="form.edgeNum"
      />
      <div class="b" />
      <van-cell
        title="选择桥梁"
        :border="false"
      />
      <div class="radio-box">
        <van-radio-group v-model="form.bridgeId">
          <van-radio
            :name="bridge.id"
            shape="square"
            v-for="bridge in preData.bridge"
            :key="bridge.id"
          >
            {{ bridge.bridgeName }}
          </van-radio>
        </van-radio-group>
      </div>
    </div>
    <van-button
      class="bottom"
      type="info"
      block
      @click="onConfirm"
    >
      保存
    </van-button>
  </div>
</template>

<script>
import WeekSelect from './components/WeekSelect.vue'
import _ from 'lodash'

export default {
  name: "PlanEditPage",
  components: {
    WeekSelect
  },
  data() {
    return {
      form: {
        bridgeId: '',
        year: '', // 年份
        gmtMonth: "", // 月份
        weekInMonth: "", // 当月第几周
        yearMonthWeek: "", // 年月周
        sliceNum: "", // 梁片总数
        middleNum: "", // 中间梁片数
        edgeNum: "", // 边缘梁片数
      }
    };
  },
  created() {},
  methods: {
    async onConfirm() {
      // 判断参数
      if (!this.form.yearMonthWeek) return this.$toast.fail('请选择所属周');
      if (!this.form.sliceNum) return this.$toast.fail('请输入梁片总数');
      if (!this.form.middleNum) return this.$toast.fail('请输入中梁总数');
      if (!this.form.edgeNum) return this.$toast.fail('请输入边梁总数');
      if (!this.form.bridgeId) return this.$toast.fail('请选择桥梁');

      // 处理数据
      let data = _.cloneDeep(this.form)
      data.year = parseInt(data.yearMonthWeek.slice(0, 4));
      data.gmtMonth = data.yearMonthWeek.slice(4, 6);
      data.weekInMonth = parseInt(data.yearMonthWeek.slice(6, 8));
      data.fieldId = this.$store.state.user.userInfo.unitId

      // 添加数据
      this.$toast.loading({  message: '加载中...', forbidClick: true });
      await this.api.ADD_WEEK_PLAN(data)
      this.$toast.clear()
      this.$router.back()
    }
  },
};
</script>

<style lang="scss" scoped>
@import "./style.scss";
.radio-box {
  .van-radio {
    margin-top: 15px;
    padding: 0 40px;
    &:first-child {
      margin-top: 0;
    }
  }
}
</style>
